<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>
      Google Visualization API Sample
    </title>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['corechart']});
    </script>
    <script type="text/javascript">
      function drawVisualization() {
    	  var machine_a_size = ${requestScope.machine_a_size};
    	  var machine_b_size = ${requestScope.machine_b_size};
    	  var machine_c_size = ${requestScope.machine_c_size};
    	  var machine_a_isFault = ${requestScope.machine_a_isFault};
    	  var machine_b_isFault = ${requestScope.machine_b_isFault};
    	  var machine_c_isFault = ${requestScope.machine_c_isFault};
        // Some raw data (not necessarily accurate)
        var data = google.visualization.arrayToDataTable([
          ['MachineA : 총생산량', 'MachineA : 불량갯수', 'MachineB : 총생산량', 'MachineB : 불량갯수', 'MachineC : 총생산량', 'MachineC : 불량갯수'],
          [machine_a_size, machine_a_isFault, machine_b_size, machine_b_isFault, machine_c_size, machine_c_isFault]
        ]);

        var options = {
          title : 'Monthly Coffee Production by Country',
          vAxis: {title: "총생산량"},
          hAxis: {title: " "},
          seriesType: "bars",
          series: {5: {type: "line"}},
          trigger: 'none'
        };
        
        var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
      google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>